import ROBOT_AVATAR from '@/assets/image/avatar_robo.png';
const Guide: React.FC<any> = (props: any) => {
  const { data } = props;
  return (
    <div className="commandList">
      <div className="commandList-hd">
        <img className="avatar" src={ROBOT_AVATAR} height={42} width={40} />
      </div>
      <div className="commandList-bd">
        {props.type === 'guide1' ? (
          <div className="guideTitle">领导您好，我是您的写作实习生 - 小麦</div>
        ) : (
          <></>
        )}
        {props.type === 'guide2' ? (
          <div className="guideInfo">
            我将来为您完成<span>【{data?.display_name}】</span>的写作
          </div>
        ) : (
          <></>
        )}
        {props.type === 'guide3' ? (
          <div className="guideInfo">
            如果您告诉我一些基础信息，可以帮助我写的更好。包括：
            {data?.blue_tags?.map((tag: any, index: number) => (
              <span key={index} className="tag">
                {tag}
              </span>
            ))}
            {data?.red_tags?.length > 0 && (
              <span>
                或其他
                {data?.red_tags?.map((tag: any, index: number) => (
                  <span key={index} className="tag redTag">
                    {tag}
                  </span>
                ))}
              </span>
            )}
          </div>
        ) : (
          <></>
        )}
      </div>
    </div>
  );
};
export default Guide;
